<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript">

        //第一题 全局变量任何地方都可以访问
        //        var num = 12;
        //        function test1() {
        //            alert(num);
        //        }
        //        test1();

        //第二题 局部变量只能在内部调用
        //        function test2() {
        //            var n = 100;
        //        }
        //        test2();
        //        alert(n);
        //第三题
        //        function test3() {  //函数内部声明的变量 如果不加var  表示全局变量
        //            n = 99;
        //        }
        //        test3();
        //        alert(n);

        //第四题   //函数内部的全局变量 与 函数外部的全局变量

        //        function test8() {
        //            var a = 10;
        //            alert(a);
        //        }
        //        var a = 100;
        //        test8();
        //        alert(a);


        //        var num = 10;  //形式参数
        //        function test(num) {
        //            //var num= 999;
        //            var abc = 100;
        //            alert(abc);
        //        }
        //        test(999);
        //        alert(num);

        //        var num = 10;  //形式参数
        //        function test(num) {
        //            //var num = 999;
        //            alert(num);
        //            num = 100;
        //        }
        //        test(999);
        //        alert(num);
        //        var num = 10;  //形式参数
        //        function test(num) {
        //            //var  abc;
        //            alert(abc);
        //            let abc = 100;
        //            alert(abc);
        //        }
        //        //var abc = 9;
        //        test(999);
        //        alert(num);
        //        alert(n);
        //        var  n = 999;
        //        function a() {
        //            //var b;
        //            var b = "c";
        //        }


        //        function test4() {
        //            var n = 99;
        //            function testA() {
        //                var m = 1;
        //                alert(n + m);
        //            }
        //
        //            testA();
        //        }
        //        test4();
        //        test4();

        // 第五题 链式作用域(chain scope) ||作用域链
        // testA 内部的所有局部变量，对于test_4都是可见
        // 但是test4内的局部变量 对于test3是不可见的
        //第6题 巩固第四题 内部函数改变外部变量
        //
        //                function test5() {
        //                    var n = 999;
        //
        //                    function testA() {
        //                        n += 1
        //                        return n;
        //                    }
        //
        //                    return testA;
        //                }
        //                var result = test5();
        //                alert(result());
        //                alert(result());
        //        window.onload = function () {
        //            function tip() {
        //                this.ele = document.createElement("div");
        //                document.body.appendChild(this.ele);
        //                this.setHtml = function (html) {
        //                    this.ele.innerHTML = html;
        //                }
        //                this.show = function(){
        //                    this.ele.style.display = "block";
        //                }
        //                this.hide = function(){
        //                    this.ele.style.display = "none";
        //                }
        //                return this;
        //            }
        //
        //            var tips = new tip();
        //            tips.setHtml("66666");
        // tips.setHtml("8888");

        //            function createDiv() {
        //                var div = document.createElement("div");
        //                function setHtml(html) {
        //                    div.innerHTML = html;
        //                    document.body.appendChild(div);
        //                    console.log(div);
        //                    return div;
        //                }
        //
        //                return setHtml;
        //            }
        //
        //            var newDiv = createDiv();
        //            newDiv("你好");
        //            newDiv("听不懂 一切都不好");
        //  }

        //数组里面放的函数
        //        var arr = new Array();
        //        for (var i = 0; i < 5; i++) {
        //            function xxx(num) {
        //                return function () {
        //                    alert(num);
        //                }
        //            }
        //            arr[i] = xxx(i);
        //        }
        //        arr[3]();
        //        var i;
        //                for (i= 0; i < 5; i++) {
        //                    for (var i = 0; i < 5; i++) {
        //                        console.log("a");
        //                    }
        //                }
        //                alert(i);
        //        function  say(){
        //            alert("1111");
        //        }
        //        say();
        //        var say = function () {//匿名函数
        //            alert("1111");
        //        }
        //        say();

        //        var person = (function (content) {
        //            return {name: content};
        //        })("aaaa");
        //        alert(person.name);

        //        for (var i = 0; i < 5; i++) {
        //            (function () {
        //                for (var i = 0; i < 5; i++) {
        //                    console.log("a");
        //                }
        //            })();
        //        }
        //第7题  对比案例1
        //change是一个全局的函数
        //        var chang = null;
        //        function test6() {
        //            var n = 999;
        //            chang = function () {
        //                n += 1;
        //                alert("全局方法改变后:" + n);
        //            }
        //            alert(n);
        //        }
        //
        //        test6();
        //        chang();
        //        test6();
        //        chang();

        //                function a() {
        //                    var num = 1;
        //                    return function () {
        //                        return ++num;
        //                    }
        //                }
        //                //闭包，可以访问函数内部的局部变量，并让其长期驻留内存
        //                var fun = a();
        //                alert(fun());
        //                alert(fun());
        //                window.onload = function(){
        //                    var btns = document.getElementsByTagName("button");
        //                    for(var i=0;i<btns.length;i++) {
        //                        //做一个匿名函数，并自运行，将i的值传递进去，保存为局部变量+
        //                        btns[i].a =i;
        //                        btns[i].onclick = function(){
        //                            alert(this.a);
        //                        }
        //                    }
        //                }

        //                        window.onload = function(){
        //                            var btns = document.getElementsByTagName("button");
        //                            for(var i=0;i<btns.length;i++) {
        //                                //做一个匿名函数，并自运行，将i的值传递进去，保存为局部变量+
        //                                (function(index){
        //                                    btns[index].onclick= function(){
        //                                        alert(index);
        //                                    }
        //                                })(i);
        //
        //                            }
        //                        }

        //第8题 闭包的作用
        //        function test7() {
        //            var n = 9999;
        //            chang = function () { //声明一个全局变量
        //                n++;
        //                alert("外部调用的全局方法改变值为:" + n);
        //            }
        //            var callChange = function () {
        //                n++;
        //                alert("我来获取大方法中的变量值:" + n);
        //            }
        //            alert("方法声明的时候触发:" + n);
        //            return callChange;
        //        }
        //        var result = test7();
        //        result();
        //        chang();
        //        result();
        //        chang();


        //第十一题 利用匿名函数和闭包的联合使用
        //        var oEvent = {};
        //        (function () {
        //            var num = 1
        //            var addEvent = function () {
        //                alert("我是添加事件:" + (++num));
        //            };
        //            function removeEvent() {
        //                alert("我是移除事件:" + num--);
        //            }
        //
        //            oEvent.addEvent = addEvent;
        //            oEvent.removeEvent = removeEvent;
        //        })();
        //        oEvent.addEvent();
        //        oEvent.removeEvent();

        //        var oEvent = {};
        //        var keep = function () {
        //            var addEvent = function () {
        //                alert("a");
        //            }
        //            var removeEvent = function () {
        //                alert("b");
        //            }
        //            oEvent.addEvent = addEvent;
        //            oEvent.removeEvent = removeEvent;
        //        }
        //        keep();
        //        oEvent.addEvent();
        //        oEvent.removeEvent();


        //第十二题  巩固匿名和闭包

        var test = null;
        (function () {
            var one = 1;
            function inner() {
                one += 1;
                alert(one)
            }
         //  return inner;
            test = inner;
        })();
        test();
        test();
        test();
    </script>
</head>
<body>
<button id="btn">测试</button>
<button id="btn1">测试</button>
<button id="btn2">测试</button>
</body>
</html>